<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <script>

        // 页面资源加载完毕之后事件被触发
        window.onload = function () {
            var oDiv = document.getElementById('a');
            console.log(oDiv);  // null
        }

    </script>
</head>

<body>

    <div id="a"></div>

    <script>

        // window.onload  事件


        // 页面一打开的时候，既没有获取焦点也没有失去焦点
        //    点地址栏获取其他应用的时候会失去焦点
        //    点回来页面的某个地方的时候会获取焦点

        //   当页面失去焦点的时候，时间再流逝，但是会延缓当前页面的DOM加载

        // 获取焦点
        window.onfocus = function () {
            console.log('focus');
        }

        // 失去焦点
        window.onblur = function () {
            console.log('blur');
        }


        // setInterval(function () {
        //     document.write('啊啊')
        // }, 100)




        // 窗口大小发生改变
        window.onresize = function () {
            console.log(888);
        }


        // 滚动条的位置发生改变
        window.onsrcoll = function () {
            console.log(999);
        }


    </script>

</body>

</html>